import { memo } from 'react'
import { Typography, Radio, Space } from 'antd'
import { QuestionRadioDefaultProps } from './interface'

const { Paragraph } = Typography

const QuestionRadio = memo(props => {
  const { title, isVertical, options = [], value } = { ...QuestionRadioDefaultProps, ...props }

  return (
    <div>
      <Paragraph strong>{title}</Paragraph>
      <Radio.Group value={value}>
        <Space direction={isVertical ? 'vertical' : 'horizontal'}>
          {options.map(option => (
            <Radio key={option.value} value={option.value}>
              {option.text}
            </Radio>
          ))}
        </Space>
      </Radio.Group>
    </div>
  )
})

export default QuestionRadio
